<template>
  <div class="bg">
    <nav-com
      title="批发收益"
      :showView='showView'
      @back="backHandler()"
    ></nav-com>
    <van-pull-refresh
      v-model='isLoading'
      @refresh='onRefresh'
    >
    <div class="top-bg">
        <div class="top-detail">
          <div class="top-main">
            <div>
              <div class="text">预计今日销售额</div>
              <div class="num">{{ dataInfo.all_sum }}</div>
              <div class="text">昨日销售额</div>
              <div class="num">{{ dataInfo.y_all_sum }}</div>
            </div>
            <div
              style="border-right: 1px solid #eee; width: 2px; height: 12vh"
            ></div>
            <div>
              <div class="text" style="color: #000">我的批发总收益</div>
              <div class="num">{{ dataInfo.one_sum }}</div>
              <div class="text" style="color: #000">我的今日批发收益</div>
              <div class="num">{{ dataInfo.m_one_sum}}</div>
            </div>
          </div>
        </div>
      </div>
    <div>
      <div style="display: flex; margin: 5vw 4vw;">
          <img
            src="../../../assets/my/ad-icon.png"
            style=" width: 18px"
          />
          <div style="font-size: 15px;margin-left: -10px;">我的批发收益记录</div>
        </div>
        <div class="list-box" v-for="item in dataList" :key="item.id">
          <div class="list-box-all" style="display: flex;
            width: 100vw;
            flex-direction: column;
            margin: 0 10px;color: #808080;font-size: 10px;">
            <div style="border-bottom: 1px solid #EEEEEE;">{{ item.addtime }}</div>
            <div style="display:flex;justify-content: space-between;">
              <div style="color:#000000">
                {{ item.goods_title }}
              </div>
              <div style="color:#FE4B20">
                {{ item.money }}
              </div>
            </div>
          </div>
        </div>
    </div>
    </van-pull-refresh>

  </div>

</template>

<script scoped>
import { getSellProfit, getSellProfitList,getProfitStatistics } from "@/api/api";
import navCom from "@/component/nav";
import Loading from "@/component/loading";
import { Toast } from "vant";
export default {
  components: {
    navCom,
    Loading,
  },
  data() {
    return {
      showView: true,
      isLoading: false,
      allInfo:{},
      dataList:{},
      dataInfo:{},
    };
  },
  filters:{
    roleFilter(val){
      let roleName = {"1":'推广员',"2":'代言人',"3":'一星网店经销商',"4":'二星网店经销商',"5":'银牌经销商',"6":'金牌经销商',"7":'钻石经销商'}
      return roleName[val]
    }
  },
  created(){
    this.initData()
  },
  methods: {
    initData(){
      getProfitStatistics({type:2}).then((result) => {
        console.log("getProfitStatistics",result);
        if(result.data.code==1){
          this.dataInfo=result.data.data;
          this.dataList=result.data.data.one_list;
          console.log(this.dataList);
        }else{
          Toast(result.data.msg);
        }
      }).catch((err) => {
        
      });
    },
    //返回
    backHandler() {
      if(weixin.isAndroid()){
        window.JS_TROOPS.goBack()
      }else{
        this.$router.go(-1);
      }
    },
    onRefresh() {
      this.isLoading = false;
    },
  },
};
</script>

<style scoped>

.list-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 2vw 4vw;
  width: 90vw;
  line-height: 40px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  font-size: 16px;
  font-weight: 700;
  box-shadow: 0px 2px 5px 1px rgb(254 75 32 / 10%);
  margin-bottom: 10px!important;
}
.list-box .list-box-all {
  font-size: 16px;
  color: #fe4b20;
}
</style>
<style scoped>
.top-bg {
  background: url("../../../assets/ADbg.png");
  min-height: 38vw;
  padding: 5vw;
  background-repeat: round;
}
.top-bg .top-detail {
  background-color: #fff;
  min-height: 35vw;
  border-radius: 2vw;
  /* align-content: center; */
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
}
.top-bg .top-detail .top-main {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  align-items: center;
  padding: 1vw 2vw;
  min-height: 35vw;
  text-align: center;
}
.top-bg .top-detail div .text {
  text-align: center;
  color: #808080;
  font-size: 12px;
  display: flex;
  align-items: center;
  height: 3.2vh;
}
.top-bg .top-detail div div .num {
  /* display: flex; */
  align-items: center;
  font-size: 16px;
  line-height: 30px;
  color: #fe4b20;
  display: block;
  /* width: 100px; */
}
.num {
  text-align: center;
  font-size: 18px;
  color: #fe4b20;
}
.list-box {
  background: #fff;
  border-radius: 10px;
  margin: 2vw auto;
  width: 95vw;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.list-box .list-box-all {
  margin-top: 2vw;
  color: #808080;
  font-size: 14px;
  padding: 1vw 1vw;
  display: flex;
  justify-content: space-around;
}
.list-box .list-box-all .box-left {
  line-height: 26px;
}
.list-box .list-box-all .box-left div {
  display: flex;
  align-items: center;
}
.list-box .list-box-all .box-right {
  margin-left: 0vw;
  text-align: center;
  margin-top: 3vw;
  font-size: 16px;
  color: #000;
}
</style>
<style>
body {
  background: #fff9f7 !important;
}
</style>